/* color palette from <https://github.com/vuejs/theme> */
:root {
  --vt-c-white: #ffffff;

  --vt-c-black: #181818;

  --vt-c-indigo: #202632;
  /* 线-line */
  --vt-c-divider-light-1: #F2F2F7;
  --vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
  --vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);

  --vt-c-text-light-1: var(--vt-c-indigo);
  --vt-c-text-light-2: rgba(60, 60, 60, 0.66);

  --vt-c-text-dark-1: var(--vt-c-white);
  --vt-c-text-dark-2: rgba(235, 235, 235, 0.64);

  --font-regular: 'FormaDJRDisplay-Regular';
  --font-medium: 'FormaDJRDisplay-Medium';
  --font-bold: 'FormaDJRDisplay-Bold';

  --hedaer-height: 64px;
  --input-height: 30px;
  /* --primary-color: #2272FF; */
  --primary-color: #286fea;
  /* --primary-color: #139aa9; */
  --hover-color: #1b4fa9;
  --vt-box-shadow: 1px 1px 5px 0px rgba(76, 82, 87, 0.1);
  --color-border1: #e9ecef;

}

/* semantic color variables for this project */
:root {
  --color-background: var(--vt-c-white);

  --color-border: var(--vt-c-divider-light-1);
  --color-border-hover: var(--vt-c-divider-light-1);

  --color-heading: var(--vt-c-text-light-1);
  --color-text: var(--vt-c-text-light-1);
  --color-text2: var(--vt-c-text-light-2);

  --section-gap: 160px;
}



.light-scheme {
  /* background: var(--vt-c-white); */
  --color-background: var(--vt-c-white);
}

.dark-scheme {
  /* background: var(--vt-c-black) */
  --color-background: var(--vt-c-black);
  --color-border: var(--vt-c-divider-black-2);
  --color-border-hover: var(--vt-c-divider-black-1);

  --color-heading: var(--vt-c-text-black-1);
  --color-text: var(--vt-c-text-black-1);

}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-weight: normal;
  letter-spacing: 1px;
}

i {
  font-style: normal;
}

body {
  min-height: 100vh;
  color: var(--color-text);
  background: var(--color-background);
  transition:
    color 0.5s,
    background-color 0.5s;
  line-height: 1.6;
  font-family: var(--font-regular);
  font-size: 15px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}